<template>
    <div>
        <TaskInfoList ref="listSearchFef" @onAdd="onAdd" @onEdit="onEdit" @onDetail="onDetail" />
        <TaskInfoAdd v-if="visibleAdd" @onClose="onClose" />
        <TaskInfoEdit v-if="visibleEdit" @onClose="onClose" />
        <TaskInfoDetail v-if="visibleDetail" @onClose="onClose" />
    </div>
</template>

<script lang="ts">
import { toRefs, reactive, onMounted, ref, defineComponent, provide } from 'vue';
import { TaskInfoDetailModel } from '/@/interfaces/SystemserviceModel';
import useObjectUtil from '/@/utils/objectUtil';
import TaskInfoList from './component/task-info-list.vue';
import TaskInfoAdd from './component/task-info-add.vue';
import TaskInfoEdit from './component/task-info-edit.vue';
import TaskInfoDetail from './component/task-info-detail.vue';

interface State {
    visibleAdd: boolean | false,
    visibleEdit: boolean | false,
    visibleDetail: boolean | false,
}

export default defineComponent({
    name: 'TaskInfo',
    components: { TaskInfoAdd, TaskInfoEdit, TaskInfoDetail, TaskInfoList },
    setup() {
        const listSearchFef = ref();
        const selectRow = reactive({});
        const state = reactive<State>({
            visibleAdd: false,
            visibleEdit: false,
            visibleDetail: false,
        });
        provide('detailData', selectRow);
        const methodMap = reactive({
            onAdd: function () {
                state.visibleAdd = true;
            },
            onEdit: function (record: TaskInfoDetailModel) {
                useObjectUtil.assignAll(selectRow, record);
                state.visibleEdit = true;
            },
            onDetail: function (record: TaskInfoDetailModel) {
                useObjectUtil.assignAll(selectRow, record);
                state.visibleDetail = true;
            },
            onClose: function () {
                state.visibleAdd = false;
                state.visibleEdit = false;
                state.visibleDetail = false;
                listSearchFef.value.onSearch();
            }
        });
        // 页面加载时
        onMounted(() => {
            listSearchFef.value.onSearch();
        });
        return {
            listSearchFef,
            ...toRefs(state),
            ...toRefs(methodMap),
            ...toRefs(selectRow)
        };
    },
});
</script>
